<template>
	<view class="dataStatisticsDL">
		<view class="dataStatisticsTopBox">
			<u-navbar title="数据统计" title-color="#333" back-icon-color="#333"></u-navbar>
			<view class="dataStatistics-date-dateChange">
				<view class="dataStatistics-date-startDate" @click='dateStart=true'>
					<text>{{dateStartStr}}</text>
				</view>
				<text class="iconfont iconxiala1"></text>
				<view class="dataStatistics-date-dateLine">至</view>
				<view class="dataStatistics-date-startDate" @click='dateEnd=true'>
					<text>{{dateEndStr}}</text>
				</view>
				<text class="iconfont iconxiala1"></text>
			</view>
			<view class="statistical-methods">
				<view class="statistical-methods-name">统计方式</view>
				<text class="iconfont iconxiala1" style="display: none;"></text>
				<view class="dataStatistics-date-dateLine"></view>
				<view class="statistical-methods-name statistical-methods-option" @click="statisticsShow = true">
					<text>{{statisticsName}}</text>
				</view>
				<text class="iconfont iconxiala1"></text>
			</view>
		</view>
		<view class="statistics-banner">
			<view class="statistics-banner-box">
				<image :src="getStaticFilePath('/send.png')" alt="">
					<view class="statistics-banner-title-box">
						<view class="statistics-banner-title">数据统计</view>
						<view class="statistics-banner-list">
							<view>
								<view class="statistics-banner-name">总重量(吨)</view>
								<view class="statistics-banner-number">{{dataStatisCount.SALTB410CA12}}</view>
							</view>
							<view>
								<view class="statistics-banner-name">总金额(元)</view>
								<view class="statistics-banner-number" v-if="AuthorizationOBJ.ORMTB417CA06==0">***</view>
								<view class="statistics-banner-number" v-else>{{dataStatisCount.SALTB410CA13}}</view>
							</view>
							<view @click="detailsClick()">
								<view class="statistics-banner-name">总车次</view>
								<view class="statistics-banner-number">{{dataStatisCount.count}}</view>
							</view>
						</view>
					</view>
			</view>
		</view>
		<view v-if="dataStatisList.length!=0">
			<view class="dataStatistics-list-title">
				<view class="dataStatistics-carNumber">车牌号</view>
				<view class="dataStatistics-weight">总重量(吨)</view>
				<view class="dataStatistics-money">总金额(元)</view>
				<view class="dataStatistics-trainNumber">总车次</view>
				<view class="dataStatistics-details"></view>
			</view>
			<ul class="dataStatistics-list-ul">
				<li v-for="(item,index) in dataStatisList" :key='index'>
					<view class="dataStatistics-carNumber">{{item.SALTB410CA01}}</view>
					<view class="dataStatistics-weight">{{item.SALTB410CA12}}</view>
					<view class="dataStatistics-money" v-if="AuthorizationOBJ.ORMTB417CA06==0">***</view>
					<view class="dataStatistics-money" v-else>{{item.SALTB410CA13}}</view>
					<view class="dataStatistics-trainNumber">{{item.count}}</view>
					<view class="dataStatistics-details iconfont iconarrow_right" @click="detailsClick(item)"></view>
				</li>
			</ul>
		</view>
		<!-- <view class="sendorder-loadmore">
			<u-loadmore v-if="dataStatisList.length!=0" :status="status" :icon-type="iconType" :load-text="loadText" />
		</view> -->
		<!-- 缺醒页 -->
		<view class="zanWSJ" v-else>
			<image :src="getStaticFilePath('/QXY/noData.png')" alt="">
		</view>
		<u-picker v-model="dateStart" mode="time" :params="params" @confirm="dateStartConfirm"></u-picker>
		<u-picker v-model="dateEnd" mode="time" :params="params" @confirm="dateEndConfirm"></u-picker>
		<u-select v-model="statisticsShow" :default-value="statusIndex" :list="statisticsColumns" @confirm="statisticsOnConfirm">
		</u-select>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// status: 'loading',
				// iconType: 'flower',
				// loadText: {
				// 	loadmore: '轻轻上拉',
				// 	loading: '努力加载中',
				// 	nomore: '实在没有了'
				// },
				userinfo:JSON.parse(uni.getStorageSync('userinfo')),
				params: {
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: true,
					second: true
				},
				dateStart: false,
				dateStartStr: this.dateTransfor(new Date(), "yyyy-MM-dd" + " 00:00:00"),
				dateEnd: false,
				dateEndStr: this.dateTransfor(new Date(), "yyyy-MM-dd hh:mm:ss"),
				statisticsColumns: [{
					value: '1',
					label: '客户统计'
				},],
				statisticsName: '客户统计',
				statisticsShow: false,
				dataStatisCount: {
					SALTB410CA12: 0,
					SALTB410CA13: 0,
					count: 0,
				},
				dataStatisList: [],
				AuthorizationOBJ:'',
				
			}
		},
		mounted() {
			
			if(this.userinfo.sign == 'CUS-3'){
				this.queryAuthorization()
			}
			this.dataList()
		},
		methods: {
			queryAuthorization(){//查询子账户权限
				uni.showLoading({
					title: '加载中...',
					mask:true
				});
				uni.request({
					url: this.baseUrl + '/orm/ormtb417/selectAccess/'+this.userinfo.ORMTB417ID, 
					method: 'GET',
					success: (res) => {
						console.log(res);
						uni.hideLoading();
						if (res.data.code == 200) {	
							this.AuthorizationOBJ=res.data.data
						}else{
							this.$refs.uToast.show({
								title: res.data.message,
								type: 'default',
								icon:false
							})
						}
					},
					fail: (res) => {
						uni.hideLoading();
						this.$refs.uToast.show({
							title: res.errMsg,
							type: 'default',
							icon:false
						})
					}
				});
			},
			dataList() {
				uni.showLoading({
					title: '请求中...',
					mask: true
				});
				uni.request({
					url: this.baseUrl + '/count/v1/count107',
					method: 'POST',
					dataType: 'json',
					data: {
						SETTB131ID: this.userinfo.SETTB131ID,
						SETTB116ID: this.userinfo.SETTB116ID,
						startTime: this.dateStartStr,
						endTime: this.dateEndStr,
					},
					success: (res) => {
						// console.log(res);
						if (res.data.result == 1) {
							this.dataStatisCount = res.data.data.saltb410Count;
							this.dataStatisList = res.data.data.saltb410CountList;
						} else {
							this.dataStatisCount = {
								SALTB410CA12: 0,
								SALTB410CA13: 0,
								count: 0,
							}
							this.dataStatisList=[];
							uni.showToast({
								title: res.data.message,
								duration: 5000,
								icon: 'none',
							});
						}
						uni.hideLoading();
					},
					fail: (res) => {
						uni.hideLoading();
						uni.showToast({
							title: res.data.errMsg,
							duration: 5000,
							icon: 'none',
						});
					}
				});
			},
			detailsClick(item) {
				uni.navigateTo({
					url:'../datastatisticsDetails/index'+`?carNumber=${item.SALTB410CA01}&startTime=${this.dateStartStr}&endTime=${this.dateEndStr}`
				})
			},
			statisticsOnConfirm(e) {
				this.statisticsShow = false;
				this.statisticsName = e[0].label;
				this.dataList()
			},
			dateStartConfirm(e) {
				// console.log(e)
				this.dateStartStr = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second
				this.dataList()
			},
			dateEndConfirm(e) {
				// console.log(e)
				this.dateEndStr = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second
				this.dataList()
			},
			dateTransfor(date, format) {
				var o = {
					"M+": date.getMonth() + 1,
					"d+": date.getDate(),
					"h+": date.getHours(),
					"m+": date.getMinutes(),
					"s+": date.getSeconds(),
					"q+": Math.floor((date.getMonth() + 3) / 3),
					"S": date.getMilliseconds()
				};
				if (/(y+)/.test(format)) {
					format = format.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
				}
				for (let k in o) {
					if (new RegExp("(" + k + ")").test(format)) {
						format = format.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
					}
				}
				return format;
			},
		}
	}
</script>

<style scoped>
	/* .dataStatisticsDL{
		background: #F2F2F2;
		min-height: 100vh;
		min-width: 100vw;
		box-sizing: border-box;
	} */
	.sendorder-loadmore {
		/* background-color: #e3e3e3; */
		padding: 20rpx 0 20rpx 0;
	}

	.dataStatisticsDL .zanWSJ {
		width: 100%;
		min-height: 400rpx;
		font-size: 18rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}

	.dataStatisticsDL .zanWSJ>image {
		width: 315rpx;
		height: 365rpx;
	}

	.dataStatisticsDL .dataStatisticsTopBox {
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 223;
	}


	/* 时间 */
	.dataStatistics-date-dateChange {
		margin-top: 2rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 4rpx 60rpx;
		background: #fff;
	}

	.dataStatistics-date-startDate {
		width: 239rpx;
		color: #808080;
		font-size: 26rpx;
		text-align: center;
	}

	.dataStatistics-date-dateLine {
		font-size: 28rpx;
		color: #333333;
		margin: 0 50rpx;
	}

	.statistical-methods {
		width: 100%;
		margin-top: 2rpx;
		padding: 15rpx 60rpx;
		background: #fff;
		font-size: 0;
		display: flex;
		flex-direction: row;
		align-items: center;
		border-top: 1px solid rgba(153, 153, 153, 0.3);
		border-bottom: 1px solid rgba(153, 153, 153, 0.3);
	}

	.statistical-methods-name {
		/* width: 2.85rem; */
		width: 239rpx;
		display: inline-block;
		text-align: center;
		font-size: 28rpx;
		color: #808080;
	}

	.statistical-methods-option {
		/* margin-left: 2.2rem; */
		color: #333;
	}

	/* banner */
	.statistics-banner {
		width: 100%;
		margin-top: 299rpx;
		padding: 40rpx 24rpx;
		background-color: #fff;
	}

	.statistics-banner-box {
		width: 100%;
		height: 310rpx;
		position: relative;
	}

	.statistics-banner-box image {
		width: 100%;
		height: 100%;
	}

	.statistics-banner-title-box {
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	.statistics-banner-title {
		margin: 60rpx 0 50rpx 40rpx;
		font-size: 42rpx;
		color: rgba(255, 217, 25, 1);
	}

	.statistics-banner-list {
		width: 100%;
		display: flex;
		justify-content: space-between;
		padding: 0 40rpx;
		flex-direction: row;
		align-items: center;
	}

	.statistics-banner-name {
		font-size: 26rpx;
		color: rgba(255, 255, 255, .8);
	}

	.statistics-banner-number {
		font-size: 36rpx;
		color: rgba(255, 255, 255, 1);
		text-align: center;
	}

	/* 列表 */
	.dataStatistics-list-title {
		width: 100%;
		font-size: 0;
		padding: 0 24rpx;
		background: #F2F2F2;
	}

	.dataStatistics-list-title>view {
		display: inline-block;
		font-size: 24rpx;
		text-align: center;
		color: #999;
		padding: 18rpx 0;
	}

	.dataStatistics-carNumber {
		width: 151rpx;
	}

	.dataStatistics-weight {
		width: 180rpx;
	}

	.dataStatistics-money {
		width: 180rpx;
	}

	.dataStatistics-trainNumber {
		width: 86rpx
	}

	.dataStatistics-details {
		width: 72rpx;
	}

	.dataStatistics-list-ul {
		margin-bottom: 144rpx;
		background-color: #fff;
		font-size: 0;
		padding: 0 24rpx;
	}

	.dataStatistics-list-ul>view>view {
		display: inline-block;
		font-size: 28rpx;
		padding: 23rpx 0;
		color: #333;
		text-align: center;
	}
</style>
